<template>
    <div class="g-bd">
        <div class="g-wrap n-alblist f-pr">
            <template v-for="(item, index) in AblumData" key="index">
                <TitleBar :title="item.title" :tabs="item.tabs" :hasTabs="item.hasTabs" :titleType="item.titleType"
                    :isTitleDot="item.isTitleDot" :isMore="item.isMore" />
                <ul class="m-cvrlst m-cvrlst-alb2 clear-block">
                    <CoverTwo v-for="(subItem, index2) in item.coverList" key="index2" v-bind="subItem"></CoverTwo>
                </ul>
            </template>
            <Pagination></Pagination>
        </div>
    </div>
</template>
<script setup>
import TitleBar from '@/components/TitleBar.vue';
import CoverTwo from '@/components/CoverTwo.vue';
import Pagination from '@/components/Pagination.vue';
import AblumData from '@/json_data/ablum/ablum_data.json';

</script>

<style lang="scss" scoped>
.n-alblist {
    .m-cvrlst {
        margin: 20px 0 0 -33px;
    }
}
</style>